<template>
  <div class="content">
    <div class="breadcrumb" :gutter="24">
      {{ $t("recipe.process_formula") }} {{process}}

    </div>
    <el-form ref="form" :model="formData" label-width="90px" size="small">
      <el-row :gutter="28">
        <el-col :xs="9" :sm="6" :md="5" :lg="5" :xl="4">
          <el-form-item :label="$t('recipe.device_group_sel')" class="selectItem">
            <el-select v-model="formData.trainId" remote filterable :remote-method="remoteMethodGroup" placeholder=""
              v-el-select-loadmore="loadMoreGroupFun" clearable @clear="clearGroup">
              <el-option v-for="(item,index) in groupList" :key="index" :label="item.entName" :value="item.fid"></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :xs="2" :sm="2" :md="2" :lg="2" :xl="2">
          <el-form-item label-width="0px">
            <el-button type="primary" size="small" @click="handleConfirmGroup()" :disabled="isreadOnly"
              :loading="loading">{{ $t("run.confirm") }}</el-button>
          </el-form-item>
        </el-col>

        <div class="btngroup">
          <el-button type="primary" size="small" @click="handleFormula()">{{ $t("recipe.sel_recipe") }}</el-button>
          <el-button type="primary" size="small" :disabled="isreadOnly" @click="handleAdd()">{{ $t("common.add") }}</el-button>
          <el-button type="primary" size="small" :disabled="isreadOnly" @click="handleEdit()">{{ $t("common.edit") }}</el-button>
          <el-button type="primary" size="small" :disabled="isreadOnly" @click="handleDel()">{{ $t("common.remove") }}</el-button>
          <!-- <el-button type="info" size="small" :disabled="isreadOnly" @click="handleCheck()">{{ $t("third.check") }}</el-button> -->
        </div>
      </el-row>
    </el-form>

    <mxgraphVue></mxgraphVue>


    <div class="tableAuto">
      <el-table :data="tableData" v-loading="tableLoading" style="width: 100%" :height="height" @row-click="rowClick"
        :header-cell-style="{background:'#EAEBEC'}" @expand-change="handledetail" ref="refTable" highlight-current-row
        @sort-change='sortChange'>
        <el-table-column label="" width="50" align="center">
          <template slot-scope="scope">
            <div>
              <el-radio :label="scope.row.fid" v-model="radioId">&nbsp;</el-radio>
            </div>
          </template>
        </el-table-column>
        <el-table-column type="expand">
          <template slot-scope="props">
            <div :id="'drag-table'+props.$index" style="width:100%;overflow-x:scroll;" @click="handleClickTab(props.row.fid)">
              <table class="table_form" border="0" cellspacing="0" v-loading="childTable">
                <thead class="theads" :class="'theads'+props.$index" :key="itemKey+'a'">
                  <tr :class="'trHeader'+props.$index">
                    <th style="min-width:136px">{{$t('basic.stage')}}</th>
                    <th v-for="(item,index) in headerObj['header'+props.row.fid]" :key="index"
                      :class="{'XYaxis':index+2==tdIndex&&tab_index==props.$index,'trHeaderTr':!isreadOnly}">
                      <span class="addDel" @click.stop="handleDelSeq(index)" v-if="!isreadOnly">-</span>
                      {{index+1}}
                      <span class="addDel" @click.stop="handleAddSeq(index)" v-if="!isreadOnly">+</span>
                    </th>
                  </tr>
                </thead>
                <tbody :key="itemKey">
                  <template v-for="(item,index) in props.row.child">
                    <tr :key="index+'l'" v-if="item.display">
                      <td :class="{'XYaxis':index==trIndex&&tab_index==props.$index}">{{item.text}}</td>
                      <td v-for="(el,key) in headerObj['tdBody'+props.row.fid]" :key="key+'i'"
                        @click="handleTD(index,el,props.$index,item.title,item.id,props.row.fid,item.isShow,item.text,item.type)"
                        :class="{'currTd':el==tdIndex&&index==trIndex&&tab_index==props.$index}">
                        <template v-if="item.stepVos">
                          <span v-for="(ele,index) in item.stepVos" :key="index+'ele'">

                            <span v-if="ele.seqNo == el - 1 && ele.isActive == 1 && ele.serialNo == item.id && ele.phaseDesc == item.text">
                              √
                            </span>
                          </span>
                        </template>
                      </td>
                    </tr>
                  </template>
                  <tr v-if="props.row.child.filter(item => item.display).length == 0">
                    <td colspan="33">
                      <div style="line-height:40px;color:#999">暂无数据</div>
                    </td>
                  </tr>
                </tbody>
              </table>
            </div>

          </template>
        </el-table-column>
        <el-table-column type="index" :label="$t('common.number')" width="80" align="center">
          <template slot-scope="scope">
            {{table_index(scope.$index+1)}}
          </template>
        </el-table-column>
        <el-table-column :label="$t('recipe.assignment_name')" show-overflow-tooltip prop="jobDesc"></el-table-column>
        <el-table-column :label="$t('recipe.define_equipment')" show-overflow-tooltip prop="entName">
          <template slot-scope="scope">
            <span v-if="scope.row.equipmentVo">
              {{scope.row.equipmentVo.entName}}
            </span>
          </template>
        </el-table-column>
        <el-table-column :label="$t('basic.equipment_type')" show-overflow-tooltip prop="className">
          <template slot-scope="scope">
            {{scope.row.equipmentClassVo.className}}
          </template>
        </el-table-column>
        <el-table-column :label="$t('recipe.start_sequence')" show-overflow-tooltip prop="seqNo"></el-table-column>
        <el-table-column :label="$t('recipe.auto_start')" width="100" show-overflow-tooltip prop="autoStart">
          <template slot-scope="scope">
            <span>
              {{scope.row.autoStart == 1 ? '是' : '否'}}
            </span>
          </template>
        </el-table-column>
        <!-- <el-table-column label="下个设备类型" show-overflow-tooltip prop="className">   后期可能还要
                    <template slot-scope="scope">
                        <span v-if="scope.row.nextEquipmentClassVo">
                            {{scope.row.nextEquipmentClassVo.className}}
                        </span>
                    </template>
                </el-table-column> -->

        <!-- <el-table-column label="起始设备" show-overflow-tooltip prop="firstJob" width="100">
          <template slot-scope="scope">
            {{scope.row.firstJob == 1 ? '是' : '否'}}
          </template>
        </el-table-column>
        <el-table-column label="最后设备" show-overflow-tooltip prop="finalJob" width="100">
          <template slot-scope="scope">
            {{scope.row.finalJob == 1 ? '是' : '否'}}
          </template>
        </el-table-column>
        <el-table-column :label="$t('common.to_sort')" show-overflow-tooltip prop="desc" width="100">
          <template slot-scope="scope">
            <img src="../../static/image/shang.png" alt="" :class="isreadOnly ? 'allowed' : ''"
              style="height:25px;margin-right:10px;cursor: pointer;" @click.stop="moveUp(scope.$index,scope.row)">
            <img src="../../static/image/xia.png" alt="" :class="isreadOnly ? 'allowed' : ''" style="height:25px;cursor: pointer;"
              @click.stop="moveDown(scope.$index,scope.row)">
          </template>
        </el-table-column> -->
      </el-table>
    </div>

    <div class="pagination-area">
      <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :page-sizes="[20, 30, 50, 100]"
        :page-size="pager.pageSize" :current-page="pager.pageNum" layout="total, sizes, prev, pager, next, jumper" :total="pager.total">
      </el-pagination>
    </div>

    <el-dialog v-dialogDrag :title="$t('recipe.sel_recipe')" :visible.sync="isShowDialog" :close-on-click-modal="false" width="58%"
      class="isShowDialog" :before-close="handleClose">
      <el-form :model="ruleForm" label-width="85px" ref="ruleForm" size="small" :rules="rulesJob" :hide-required-asterisk="true">
        <el-row :gutter="28">
          <el-col :xs="24" :sm="24" :md="10" :lg="10" :xl="10">
            <el-form-item :label="$t('common.keyword')">
              <el-input v-model="ruleForm.keyword" clearable placeholder=""></el-input>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="24" :md="10" :lg="10" :xl="10">
            <el-form-item :label="$t('recipe.state')" label-width="40px" class="w-100">
              <el-select v-model="ruleForm.status" placeholder="" clearable>
                <el-option v-for="(item,index) in statusList" :key="index" :label="item.label" :value="item.value"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :xs="2" :sm="2" :md="2" :lg="2" :xl="2">
            <el-form-item label-width="0px">
              <el-button type="primary" size="small" @click="handleSearch">{{ $t("common.query") }}</el-button>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <div class="tableAuto tableAuto1">
        <el-table :data="formulaList" v-loading="formulaLoading" style="left:3% ;width: 95%" height="300px" @row-click="rowFormulaClick"
          :header-cell-style="{background:'#EAEBEC'}" ref="formulaTable" highlight-current-row>
          <el-table-column label="" width="50" align="center">
            <template slot-scope="scope">
              <div>
                <el-radio :label="scope.row.fid" v-model="formulaFid">&nbsp;</el-radio>
              </div>
            </template>
          </el-table-column>
          <el-table-column type="index" :label="$t('common.number')" width="80" align="center">
            <template slot-scope="scope">
              {{table_index1(scope.$index+1)}}
            </template>
          </el-table-column>
          <el-table-column :label="$t('recipe.formula_name')" show-overflow-tooltip prop="recipeName" width="150"></el-table-column>
          <el-table-column :label="$t('common.version')" show-overflow-tooltip prop="version" width="80"></el-table-column>
          <el-table-column :label="$t('recipe.material_code')" show-overflow-tooltip prop="item" width="100"></el-table-column>
          <el-table-column :label="$t('recipe.formula_status')" show-overflow-tooltip prop="item" width="100">
            <template slot-scope="scope">
              {{queryStatus(scope.row.recipeStatus)}}
            </template>
          </el-table-column>
          <el-table-column :label="$t('recipe.formula_description')" show-overflow-tooltip prop="notes"></el-table-column>
        </el-table>

      </div>
      <div class="pagination-area" style="padding:10px 0">
        <el-pagination @size-change="handleSizeChange1" @current-change="handleCurrentChange1" :page-sizes="[10, 20, 50, 100]"
          :page-size="formulaPage.pageSize" :current-page="formulaPage.pageNum" layout="total, sizes, prev, pager, next, jumper"
          :total="formulaPage.total">
        </el-pagination>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button type="primary" size="small" :loading="ruleFormLoading" @click="handleCreate()">{{$t('run.confirm')}}</el-button>
        <el-button @click="handleClose()" size="small">{{ $t("common.cancel") }}</el-button>
      </span>
    </el-dialog>

    <el-dialog v-dialogDrag :title="title" :visible.sync="isShowAdd" :close-on-click-modal="false"
      :width="screenWidth > 1024 ? '30%' : '60%'" :before-close="handleCloseJob">
      <el-form :model="ruleFormJob" label-width="100px" ref="ruleFormJob" size="small" :rules="rulesJob" :hide-required-asterisk="true">
        <el-row :gutter="24">
          <el-col :xs="24">
            <el-form-item label="单元作业" prop="jobDesc">
              <el-input v-model="ruleFormJob.jobDesc" placeholder="" clearable></el-input>
            </el-form-item>
          </el-col>
          <el-col :xs="24">
            <el-form-item :label="$t('recipe.auto_start')" prop="autoStart" class="w-100">
              <el-select v-model="ruleFormJob.autoStart" placeholder="" clearable>
                <el-option label="是" :value="1"></el-option>
                <el-option label="否" :value="0"></el-option>
              </el-select>
              <!-- <el-input v-model="ruleFormJob.autoStart" placeholder="" clearable></el-input> -->
            </el-form-item>
          </el-col>
          <el-col :xs="24">
            <el-form-item :label="$t('recipe.start_delay')">
              <el-input v-model="ruleFormJob.delayTime" placeholder="" clearable>
                <template slot="append">min</template>
              </el-input>
            </el-form-item>
          </el-col>
          <!-- <el-col :xs="24">
            <el-form-item label="起始作业" prop="firstJob" class="selectClass">
              <el-select v-model="ruleFormJob.firstJob" placeholder="" clearable>
                <el-option label="是" :value="1"></el-option>
                <el-option label="否" :value="0"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :xs="24">
            <el-form-item label="最后作业" prop="finalJob" class="selectClass">
              <el-select v-model="ruleFormJob.finalJob" placeholder="" @change="handleFinalJob" clearable>
                <el-option label="是" :value="1"></el-option>
                <el-option label="否" :value="0"></el-option>
              </el-select>
            </el-form-item>
          </el-col> -->
          <el-col :xs="24">
            <el-form-item :label="$t('basic.equipment_type')" prop="initSchedEntId" class="selectClass">
              <el-select v-model="ruleFormJob.initSchedEntId" placeholder="" clearable filterable :remote-method="remoteMethodItemClass"
                v-el-select-loadmore="loadMoreItemClassFun" @clear="clearItemClass" @change="handleDeviceType">
                <el-option v-for="(item,index) in classIdList" :key="index" :label="item.className" :value="item.fid"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :xs="24">
            <el-form-item label="设备" class="selectClass" prop="equipmentId">
              <el-select v-model="ruleFormJob.equipmentId" filterable placeholder="" clearable @change="handleequipmentId">
                <el-option v-for="(item,index) in equipmentList" :key="index" :label="item.entName" :value="item.fid"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :xs="24" v-if="ruleFormJob.finalJob != 1">
            <!-- <el-form-item :label="$t('recipe.start_sequence')" class="selectClass" prop="seqNo"> -->
            <!-- <el-select v-model="ruleFormJob.seqNo" placeholder="" clearable @change="handleSeqNo">
                <el-option v-for="(item,index) in serialNum" :key="index" :label="item" :value="item"></el-option>
              </el-select> -->
            <!-- </el-form-item> -->
            <el-form-item :label="$t('recipe.start_sequence')" prop="seqNo">
              <el-input type="number" v-enterNumber3 v-model="ruleFormJob.seqNo" placeholder="" clearable></el-input>
            </el-form-item>

          </el-col>

          <!-- <el-col :xs="24">
                        <el-form-item label="下个设备类型" class="selectClass" v-if="ruleFormJob.finalJob != 1">
                            <el-select v-model="ruleFormJob.nextJob" placeholder="" clearable>
                                <el-option v-for="(item,index) in deviceList" :key="index" :label="item.className" :value="item.fid"></el-option>
                            </el-select>
                        </el-form-item>
                    </el-col> -->
        </el-row>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button type="primary" size="small" :loading="zyloading"
          @click="handleConfirm('ruleFormJob')">{{ $t("common.preservation") }}</el-button>
        <el-button @click="handleCloseJob()" size="small">{{ $t("common.cancel") }}</el-button>
      </span>
    </el-dialog>

    <!-- <el-dialog v-dialogDrag :title="$t('third.check')" :visible.sync="isShowCheck" :close-on-click-modal="false"
      :width="screenWidth > 1024 ? '30%' : '60%'" :before-close="handleCloseCheck">
      <div style="padding:15px 0;">
        <el-alert v-for="err in errorList" :title="err" :key="err" type="error" show-icon closable=false style="margin-bottom:10px;" />

      </div>

    </el-dialog> -->

    <!-- 阶段配置弹框 -->
    <phATO :isShowATO="isShowATO" :tdIndex="tdIndex-1" :isreadOnly="isreadOnly" @closePH="closePH" @uptionData="uptionData"
      :stepObj="stepObj"></phATO> <!-- 全自动 -->
    <phBTN :isShowBTN="isShowBTN" :tdIndex="tdIndex-1" :isreadOnly="isreadOnly" @closePH="closePH" @uptionData="uptionData"
      :stepObj="stepObj"></phBTN> <!-- 全手动 -->
    <phDATA :isShowDATA="isShowDATA" :tdIndex="tdIndex-1" :isreadOnly="isreadOnly" @closePH="closePH" @uptionData="uptionData"
      :stepObj="stepObj"></phDATA><!-- 数据 -->
    <phADM :isShowADM="isShowADM" :tdIndex="tdIndex-1" :isreadOnly="isreadOnly" @closePH="closePH" @uptionData="uptionData"
      :stepObj="stepObj"></phADM> <!-- 手动加料 -->
    <phCHA1 :isShowCHA="isShowCHA" :tdIndex="tdIndex-1" :isreadOnly="isreadOnly" @closePH="closePH" @uptionData="uptionData"
      :stepObj="stepObj"></phCHA1><!-- 自动加料一-->
    <!-- <phCHA2 :isShowCHA2="isShowCHA2" :tdIndex="tdIndex-1" :isreadOnly="isreadOnly" @closePH="closePH" @uptionData="uptionData" :stepObj="stepObj"></phCHA2>自动加料二废弃
        <phCHA3 :isShowCHA3="isShowCHA3" :tdIndex="tdIndex-1" :isreadOnly="isreadOnly" @closePH="closePH" @uptionData="uptionData" :stepObj="stepObj"></phCHA3>自动加料三废弃 -->
    <phIPT :isShowIPT="isShowIPT" :tdIndex="tdIndex-1" :isreadOnly="isreadOnly" @closePH="closePH" @uptionData="uptionData"
      :stepObj="stepObj"></phIPT><!-- 数据录入 -->
    <phAGI :isShowAGI="isShowAGI" :tdIndex="tdIndex-1" :isreadOnly="isreadOnly" @closePH="closePH" @uptionData="uptionData"
      :stepObj="stepObj"></phAGI><!-- 搅拌控制 -->
    <phTEM :isShowTEM="isShowTEM" :tdIndex="tdIndex-1" :isreadOnly="isreadOnly" @closePH="closePH" @uptionData="uptionData"
      :stepObj="stepObj"></phTEM><!-- 温度控制 -->
    <phGAS :isShowIFO="isShowIFO" :tdIndex="tdIndex-1" :isreadOnly="isreadOnly" @closePH="closePH" @uptionData="uptionData"
      :stepObj="stepObj"></phGAS><!-- 信息提示 -->
    <phTHR :isShowOTM="isShowOTM" :tdIndex="tdIndex-1" :isreadOnly="isreadOnly" @closePH="closePH" @uptionData="uptionData"
      :stepObj="stepObj"></phTHR><!-- 物料产出 -->
    <phEXC :isShowEXC="isShowEXC" :tdIndex="tdIndex-1" :isreadOnly="isreadOnly" @closePH="closePH" @uptionData="uptionData"
      :stepObj="stepObj"></phEXC><!-- 接收罐气体置换 -->
    <phREC :isShowREC="isShowREC" :tdIndex="tdIndex-1" :isreadOnly="isreadOnly" @closePH="closePH" @uptionData="uptionData"
      :stepObj="stepObj"></phREC><!-- 冷凝接受 -->
    <phTRS1 :isShowTRS="isShowTRS" :tdIndex="tdIndex-1" :isreadOnly="isreadOnly" @closePH="closePH" @uptionData="uptionData"
      :stepObj="stepObj"></phTRS1><!-- 转料一 -->
    <!-- <phTRS2 :isShowTRS2="isShowTRS2" :tdIndex="tdIndex-1" :isreadOnly="isreadOnly" @closePH="closePH" @uptionData="uptionData" :stepObj="stepObj"></phTRS2>转料二废弃 -->
    <phDATATEM1 :isShowTEMWD1="isShowTEMWD1" :tdIndex="tdIndex-1" :isreadOnly="isreadOnly" @closePH="closePH" @uptionData="uptionData"
      :stepObj="stepObj"></phDATATEM1><!-- 温度配置一 -->
    <phDATATEM2 :isShowTEMWD2="isShowTEMWD2" :tdIndex="tdIndex-1" :isreadOnly="isreadOnly" @closePH="closePH" @uptionData="uptionData"
      :stepObj="stepObj"></phDATATEM2><!-- 温度配置二 -->
    <phDATAPRE :isShowPRE="isShowPRE" :tdIndex="tdIndex-1" :isreadOnly="isreadOnly" @closePH="closePH" @uptionData="uptionData"
      :stepObj="stepObj"></phDATAPRE><!-- 温度压力 -->
    <phJUMP :isShowJUMP="isShowJUMP" :tdIndex="tdIndex-1" :isreadOnly="isreadOnly" @closePH="closePH" @uptionData="uptionData"
      :stepObj="stepObj" :equipId="equipId"></phJUMP><!-- 温度压力 -->

  </div>
</template>

<script>

import { scheduling } from "@/api/scheduling"
import { configure } from "@/api/configure"
import { addFormula } from "@/api/addFormula"
import { formula } from "@/api/formula"
import { child } from "@/utlis/phaseData.js"
import { slldrag } from "@/utlis/slldrag.js"
import phATO from "./template/phAto.vue";
import phBTN from "./template/phBtn.vue"
import phDATA from "./template/phData.vue";
import phADM from "./template/phAdm.vue";
import phCHA1 from "./template/phCha1.vue";
// import phCHA2 from "./template/phCha2.vue";
// import phCHA3 from "./template/phCha3.vue";
import phIPT from "./template/phIpt.vue";
import phAGI from "./template/phAgi.vue";
import phTEM from "./template/phTem.vue";
import phGAS from "./template/phGas.vue";
import phTHR from "./template/phThr.vue";
import phEXC from "./template/phExc.vue";
import phREC from "./template/phRec.vue";
import phTRS1 from "./template/phTrs1.vue";
// import phTRS2 from "./template/phTrs2.vue";
import phDATATEM1 from "./template/phDataTem1.vue";
import phDATATEM2 from "./template/phDataTem2.vue";
import phDATAPRE from "./template/phDataPre.vue";
import phJUMP from "./template/phJump.vue";
import Sortable from 'sortablejs'
// import mxgraphVue from './mxgraph/mxgraph.vue'
import mxgraphVue from './maxgraph1/customToolbar/customToolbar.vue'
export default {
  components: {
    mxgraphVue,
    phATO,
    phBTN,
    phDATA,
    phADM,
    phCHA1,
    // phCHA2,
    // phCHA3,
    phIPT,
    phAGI,
    phTEM,
    phGAS,
    phTHR,
    phEXC,
    phREC,
    phTRS1,
    // phTRS2,
    phDATATEM1,
    phDATATEM2,
    phDATAPRE,
    phJUMP,
  },
  data () {
    let seqNoFn = (rule, value, callback) => {
      if (this.tableData.length > 0 && !value && this.ruleFormJob.finalJob != 1) {
        callback(new Error('启动顺序不能为空'));
      } else {
        callback();
      }
    }
    let nextJobFn = (rule, value, callback) => {
      if (this.ruleFormJob.finalJob != 1) {
        if (!value) {
          callback(new Error('下个设备类型不能为空'));
        } else {
          callback();
        }
      } else {
        callback();
      }
    }
    return {
      screenWidth: document.body.clientWidth,
      height: 'calc(100vh - 230px)',
      // height: parseInt(document.body.offsetHeight - 191),
      isShowDialog: false,
      formulaList: [],
      ruleForm: {
        keyword: "",
        status: ""
        // fid:"",
        // notes:"",
        // item:"",
        // recipeStatus:""
      },
      phaseData: {
        isActive: 0,
        isAuto: 1,
        delayTime: 0.0,
        mode: 0,
        checks: 0,
      },
      formulaPage: {
        pageNum: 1,
        pageSize: 10,
        keyword: ""
      },
      process: "",
      groupList: [],
      formData: {
        trainId: ""
      },
      pageGroud: {
        pageNum: 1,
        pageSize: 100,
        keyword: ""
      },
      rules: {
        fid: [{ required: true, message: '配方名称不能为空', trigger: 'change' }],
        seqNo: [{ required: true, message: '启动顺序不能为空', trigger: 'change' }],
      },
      loading: false,
      tableData: [],
      tableLoading: false,
      radioId: "",
      equipId: "",
      pager: {
        pageNum: 1,
        pageSize: 20,
        total: 0,
        field: 'seqNo',
        order: 'asc',
      }, recipePager: {
        field: 'fCreatorTime',
        order: 'DESC',
      },
      headerObj: {
        // header:[0,1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24,25,26,27,28,29,30,31],
        // tdBody:[1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24,25,26,27,28,29,30,31,32],
      },
      trIndex: null,
      tdIndex: null,
      tab_index: -1,
      isShowAdd: false,
      isShowCheck: false,
      ruleFormJob: {
        jobDesc: "",
        initSchedEntId: "",
        seqNo: "",
        nextJob: "",
        equipmentId: "",
        firstJob: "",
        finalJob: "",
        autoStart: 0,
        delayTime: 0,
      },
      child: child,
      title: "添加",
      pagerdev: {
        pageNum: 1,
        pageSize: 10,
        keyword: ""
      },
      classIdList: [],
      serialNum: [],
      deviceList: [],
      isShowATO: false,
      isShowBTN: false,
      isShowDATA: false,
      isShowADM: false,
      isShowCHA: false,
      isShowCHA2: false,
      isShowCHA3: false,
      isShowIPT: false,
      isShowAGI: false,
      isShowTEM: false,
      isShowIFO: false,
      isShowOTM: false,
      isShowEXC: false,
      isShowREC: false,
      isShowTRS: false,
      isShowTRS2: false,
      isShowTEMWD1: false,
      isShowTEMWD2: false,
      isShowPRE: false,
      isShowJUMP: false,
      rulesJob: {
        jobDesc: [{ required: true, message: '单元作业不能为空', trigger: 'blur' }],
        initSchedEntId: [{ required: true, message: '设备类型不能为空', trigger: 'change' }],
        seqNo: [{ validator: seqNoFn, trigger: 'change' }],
        nextJob: [{ validator: nextJobFn, trigger: 'change' }],
        firstJob: [{ required: true, message: '起始作业不能为空', trigger: 'change' }],
        finalJob: [{ required: true, message: '最后作业不能为空', trigger: 'change' }],
      },
      zyloading: false,
      stepObj: {},
      equipmentList: [],
      keyEntName: "",
      tdLoading: false,
      childTable: false,
      itemKey: 0,
      isSort: false,
      curRow: {},
      isreadOnly: true,
      currObj: {},
      ruleFormLoading: false,
      isTrainVo: false,
      sortable: null,
      formulaLoading: false,
      formulaFid: "",
      statusList: [{
        label: "编辑",
        value: "1"
      }, {
        label: this.$t('common.examine'),
        value: "2"
      }, {
        label: this.$t('common.approval'),
        value: "3"
      }, {
        label: "启用",
        value: "4"
      }, {
        label: this.$t('common.abandoned'),
        value: "5"
      }, {
        label: "实验",
        value: "6"
      }],
      errorList: [],
    }
  },
  watch: {
    screenWidth (val) {
      this.screenWidth = Number(val)
    },
  },
  mounted () {
    const that = this
    window.addEventListener('resize', function () {
      that.screenWidth = document.body.offsetWidth;
    })
  },
  created () {
    this.getTbrecipeList()
    this.getTrainList()
    // this.getEquipmentClassList()
    // this.getEquipmentList()
  },
  methods: {
    //选择配方对话框
    handleFormula () {
      // this.ruleForm = {}
      // try{
      //     this.$refs['ruleForm'].resetFields();
      // } catch(e){}
      this.isShowDialog = true
    },
    //配方查询
    handleSearch () {
      this.formulaPage.pageNum = 1
      this.formulaFid = ''
      this.getTbrecipeList()
    },
    //获取配方名称列表
    getTbrecipeList () {
      const param = {
        page: this.formulaPage.pageNum,
        size: this.formulaPage.pageSize,
        recipeName: this.ruleForm.keyword,
        recipeStatus: this.ruleForm.status,
        recipeType: 1,
        field: this.recipePager.field,
        order: this.recipePager.order,
        // isRecipeStatus:[1] //只能选择编辑的配方
      }
      this.formulaLoading = true
      scheduling.getTbrecipeList(param).then(res => {
        if (res.code == 200) {
          this.formulaList = res.data.rows
          this.formulaPage.total = res.data.total
        }
        this.formulaLoading = false
      })
    },
    handleSizeChange1 (val) {
      this.formulaPage.pageNum = 1
      this.formulaPage.pageSize = val
      this.getTbrecipeList()
    },
    handleCurrentChange1 (val) {
      this.formulaPage.pageNum = val
      this.getTbrecipeList()
    },
    // loadMoreFun(){
    //     this.formulaPage.pageNum ++
    //     this.getTbrecipeList()
    // },
    // //远程搜索配方名称
    // remoteMethod(keyword){
    //     this.formulaPage.keyword = keyword.trim();
    //     this.formulaPage.pageNum = 1
    //     setTimeout(() => {
    //         this.formulaList = []
    //         this.getTbrecipeList()
    //     },200)
    // },
    // clearRecipe(){
    //     this.formulaPage.keyword = ""
    //     this.formulaPage.pageNum = 1
    //     this.formulaList = []
    //     this.getTbrecipeList()
    // },
    //选择配方处理
    rowFormulaClick (row) {
      this.formulaFid = row.fid
      this.$refs.formulaTable.setCurrentRow(row);
    },
    //选择配方-确认
    handleCreate () {
      if (!this.formulaFid) {
        this.$message.error('请选择配方');
        return
      }
      // this.$refs[formName].validate((valid) => {
      // if(valid){
      this.formData.trainId = ""
      this.isTrainVo = ""
      const item = this.formulaList.find(item => item.fid == this.formulaFid)
      this.recipeId = item.fid
      this.isreadOnly = item.recipeStatus == 1 ? false : true //除了编辑状态 其余的都不能操作
      // const index = this.groupList.findIndex(el => el.fid == item.trainVo.fid)
      // if(index == -1){
      //     this.groupList.push({
      //         entName:item.trainVo.entName,
      //         fid:item.trainVo.fid,
      //     })
      // }
      if (item.trainVo) {
        this.formData.trainId = item.trainVo.fid
        this.isTrainVo = item.trainVo.fid
      } else {
        this.formData.trainId = ""
        this.isTrainVo = ""
      }
      this.getDataList()
      this.getEquipmentClassList()
      // }
      // })
    },
    //获取配方数据
    getDataList () {
      let item = this.formulaList.find(item => item.fid == this.formulaFid)
      const param = {
        page: this.pager.pageNum,
        size: this.pager.pageSize,
        recipeId: this.recipeId,
        field: this.pager.field,
        order: this.pager.order,
      }
      this.tableLoading = true
      this.ruleFormLoading = true
      formula.operationList1(param).then(res => {
        this.tableLoading = false
        this.ruleFormLoading = false
        if (res.code == 200) {
          this.tableData = res.data.rows
          this.itemKey = new Date().getTime()
          this.serialNum = []
          this.deviceList = []
          this.pager.total = res.data.total
          this.tableData.forEach((item, index) => {
            item.child = JSON.parse(JSON.stringify(this.child))
            this.serialNum.push(index + 1)

            this.deviceList.push({
              className: item.equipmentClassVo.className,
              fid: item.equipmentClassVo.fid
            })
          })
          console.log(this.tableData)
          this.deviceList = this.$util.RemoveArr(this.deviceList, 'fid')
          try {
            this.process = " > " + item.recipeName + ' ' + (item.version == undefined ? '' : item.version) + " - " + this.queryStatus(item.recipeStatus)
          } catch (e) { }

          this.isShowDialog = false
        } else {
          this.tableLoading = false
          this.ruleFormLoading = false
        }
      }).catch(e => {
        this.$message.error('服务器繁忙,请稍后再试');
        this.tableLoading = false
        this.ruleFormLoading = false
      })
    },
    sortChange (column) {
      if (column.order === 'descending') {
        this.pager.field = column.prop
        this.pager.order = 'DESC'
      } else {
        this.pager.field = column.prop
        this.pager.order = 'ASC'
      }
      this.pager.pageNum = 1
      this.getDataList()
    },
    uptionData (obj) {
      let index = this.tableData.findIndex(item => item.fid == obj.operationId)
      let index1 = this.tableData[index].child.findIndex(item => item.text == obj.text)
      let currPhase = this.tableData[index].child[index1].stepVos || []
      for (let i = 0; i < currPhase.length; i++) {
        if (currPhase[i].phaseDesc == obj.text && currPhase[i].seqNo == obj.seqNo) {
          this.$set(currPhase[i], 'isActive', obj.isActive)
          this.itemKey = new Date().getTime() //页面上子table不更新  更新下key值刷新
          break;
        }
      }
      console.log(this.tableData)
    },
    // uptionData (obj) {
    //   let index = this.tableData.findIndex(item => item.fid == obj.operationId)
    //   let index1 = this.tableData[index].child.findIndex(item => item.id == obj.serialNo && item.text == obj.text)
    //   let currPhase = this.tableData[index].child[index1].stepVos || []
    //   for (let i = 0; i < currPhase.length; i++) {
    //     if (currPhase[i].serialNo == obj.serialNo && currPhase[i].seqNo == obj.seqNo) {
    //       this.$set(currPhase[i], 'isActive', obj.isActive)
    //       this.itemKey = new Date().getTime() //页面上子table不更新  更新下key值刷新
    //       break;
    //     }
    //   }
    //   console.log(this.tableData)
    // },
    handleSizeChange (val) {
      this.pager.pageNum = 1
      this.pager.pageSize = val
      this.getDataList()
    },
    handleCurrentChange (val) {
      this.pager.pageNum = val
      this.getDataList()
    },
    handleClose () {
      this.isShowDialog = false
    },
    //获取设备组列表
    getTrainList () {
      const param = {
        entName: this.pageGroud.keyword,
        page: this.pageGroud.pageNum,
        size: this.pageGroud.pageSize
      }
      configure.getTrainList(param).then(res => {
        if (res.code == 200) {
          this.groupList = [...this.groupList, ...res.data.rows]
          this.groupList = this.groupList.map(item => {
            return {
              entName: item.entName,
              fid: item.fid
            }
          })
        }
      })
    },
    remoteMethodGroup (keyword) {
      this.pageGroud.keyword = keyword.trim();
      this.pageGroud.pageNum = 1
      setTimeout(() => {
        this.groupList = []
        this.getTrainList()
      }, 200)
    },
    loadMoreGroupFun () {
      this.pageGroud.pageNum++
      this.getTrainList()
    },
    clearGroup () {
      this.pageGroud.keyword = ""
      this.pageGroud.pageNum = 1
      this.groupList = []
      this.getTrainList()
    },
    handleConfirmGroup () {
      if (!this.formulaFid) {
        this.$message.error('请选择配方');
        return
      }
      if (!this.formData.trainId) {
        this.$message.error('请选择设备组');
        return
      }
      const param = {
        fid: this.formulaFid,
        trainVo: {
          fid: this.formData.trainId
        }
      }
      this.loading = true
      addFormula.modifyTrain(param).then(res => {
        this.loading = false
        if (res.code == 200) {
          this.getDataList()
          this.formulaPage.pageNum = 1
          this.isTrainVo = this.formData.trainId
          this.formulaList = []
          this.getTbrecipeList()
          this.isShowDialog = false
          this.$message({ duration: 1000, type: 'success', message: '分配成功!' });
          this.getEquipmentClassList()
        } else {
          this.$message.error(res.msg);
        }
      }).catch(e => {
        this.isShowDialog = false
      })
    },
    //点击job
    async handledetail (row, expandedRows) {
      console.log(row)

      this.radioId = row.fid;
      this.equipId = row.equipmentId

      this.$refs.refTable.setCurrentRow(row);
      if (expandedRows.length > 0) {
        this.childTable = true
        let param = {
          eqpClassId: row.equipmentClassVo ? row.equipmentClassVo.fid : ''
        }
        let res1 = await configure.getEqpClassPhaseLinkList(param)
        if (res1.code == 200) {
          const index = this.tableData.findIndex(item => item.fid == row.fid)
          console.log(this.tableData[index])
          var parse = JSON.parse(JSON.stringify(this.child));
          console.log(this.child)
          this.tableData[index].child = [];
          res1.data.rows.forEach((item) => {
            const value = {
              display: true,
              type: item.phaseDefineVo.type,
              text: item.phaseDefineVo.name,
              isShow: item.phaseDefineVo.sn,
              title: item.phaseDefineVo.sn,
            }
            parse.forEach(item1 => {
              if (item.phaseDefineVo.sn == item1.title) {
                value.id = item1.id;
              }
            })
            this.tableData[index].child.push(value);
          })
          formula.findByOperationId(row.fid).then(res => {
            this.childTable = false
            if (res.code == 200) {
              this.headerObj['header' + row.fid] = []
              this.headerObj['tdBody' + row.fid] = []
              // this.tdBody = []
              var max = Math.max.apply(Math, res.data.map(function (item) {
                return parseInt(item.seqNo)
              }))
              if (max > 32) {
                for (let i = 1; i < max; i++) {
                  this.headerObj['header' + row.fid].push(i)
                  this.headerObj['tdBody' + row.fid].push(i + 1)
                }
              } else {
                this.headerObj['header' + row.fid] = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 30, 31, 32]
                this.headerObj['tdBody' + row.fid] = [2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 30, 31, 32, 33]
              }
              const index = this.tableData.findIndex(item => item.fid == row.fid)
              console.log(JSON.parse(JSON.stringify(this.tableData[index])))
              this.tableData[index].child.forEach(item => {
                this.$set(item, "stepVos", [])
                res.data.forEach(el => {
                  if (el.serialNo == item.id && item.text == el.phaseDesc) {
                    item.stepVos.push(el)
                  }
                })
              })

              console.info('handledetail', this.tableData)
              this.$nextTick(() => {
                this.colDrop()
              })
              this.itemKey = new Date().getTime()

            } else {
              const index = this.tableData.findIndex(item => item.fid == row.fid)
              this.tableData[index].child.forEach(item => {
                this.$set(item, "stepVos", [])
              })
              this.$nextTick(() => {
                this.colDrop()
              })
            }
          })


        }

      } else {
        const index = this.tableData.findIndex(item => item.fid == row.fid)
        this.tableData[index].child.forEach(item => {
          this.$set(item, "stepVos", [])
        })
        this.$nextTick(() => {
          this.colDrop()
        })
        this.itemKey = new Date().getTime()
        console.log(this.tableData)
      }

      console.log(this.tableData)
    },
    rowClick (row, column, e) {
      this.radioId = row.fid;
      this.$refs.refTable.toggleRowExpansion(row)
      this.currObj = row
      this.$refs.refTable.setCurrentRow(row);
      this.$nextTick(() => {
        this.colDrop()
      })
    },
    handleTD (trIndex, tdIndex, id, title, modeId, fid, isShow, text, type) {
      if (this.tdLoading) {
        return
      }
      this.tdLoading = true
      this.radioId = fid
      let currRow = this.tableData.find(item => item.fid == this.radioId) //当前点击的作业
      this.equipId = currRow.equipmentId
      console.log(currRow)
      // console.log(modeId)
      // console.log(tdIndex)
      this.$refs.refTable.setCurrentRow(currRow);
      if (currRow.phaseVos && currRow.phaseVos.length) { //如果已经新增过阶段信息
        let index = currRow.phaseVos.findIndex(item => {
          return item.serialNo == modeId && item.seqNo == (tdIndex - 1) && text == item.phaseDesc
        })
        console.log(index)
        if (index > -1) { //阶段信息已经新增过
          let fids = currRow.phaseVos[index].fid || currRow.phaseVos[index].fId
          formula.phaseFind(fids).then(res => {
            this.tdLoading = false
            if (res.code == 200) {
              this.stepObj = Object.assign({ texts: text }, res.data)
              this['isShow' + isShow.split("_")[1]] = true
              console.log('--' + this.stepObj)
            }
          }).catch(e => {
            this.tdLoading = false
          })

          this.trIndex = trIndex
          this.tdIndex = tdIndex
          this.tab_index = id
        } else { //某一列第一次新增步序
          if (this.isreadOnly) {
            this.stepObj = { seqNo: tdIndex - 1, mode: 0, texts: text, stepNo: tdIndex - 1, serialNo: modeId }
            this.tdLoading = false
            this.trIndex = trIndex
            this.tdIndex = tdIndex
            this.tab_index = id
            this['isShow' + isShow.split("_")[1]] = true
            return
          }
          this.phaseAdd(trIndex, tdIndex, id, title, modeId, isShow, text, type)
        }
      } else { //没有phaseVos就是一个步序都没新增过
        if (this.isreadOnly) {
          // this.stepObj = Object.assign({},{phaseDesc:title,mode:trIndex})
          this.stepObj = { seqNo: tdIndex - 1, mode: 0, texts: text, stepNo: tdIndex - 1, serialNo: modeId }
          this.tdLoading = false
          this.trIndex = trIndex
          this.tdIndex = tdIndex
          this.tab_index = id
          this['isShow' + isShow.split("_")[1]] = true
          return
        }
        this.phaseAdd(trIndex, tdIndex, id, title, modeId, isShow, text, type)
      }
    },
    // 新增阶段信息
    phaseAdd (trIndex, tdIndex, id, title, modeId, isShow, text, type) {
      const param = {
        isActive: this.phaseData.isActive,
        isAuto: this.phaseData.isAuto,
        checks: this.phaseData.checks,
        delayTime: this.phaseData.delayTime,
        operationId: this.radioId,
        phaseCode: title,
        phaseDesc: text,
        seqNo: tdIndex - 1,
        stepNo: tdIndex - 1,
        mode: 0,
        type: type,
        serialNo: modeId
      }
      formula.phaseAddInfo(param).then(res => {
        this.tdLoading = false
        if (res.code == 200) {
          const index = this.tableData.findIndex(item => item.fid == this.radioId)
          this.tableData[index].phaseVos = this.tableData[index].phaseVos ? this.tableData[index].phaseVos : []
          this.tableData[index].phaseVos.push(res.data)
          const key = this.tableData[index].child.findIndex(item => item.text == res.data.phaseDesc)
          this.tableData[index].child[key].stepVos = this.tableData[index].child[key].stepVos || []
          this.tableData[index].child[key].stepVos.push(res.data)
          this.stepObj = Object.assign({ texts: text }, res.data)
          this.stepObj.fid = this.stepObj.fId;
          this['isShow' + isShow.split("_")[1]] = true

        } else {
          this.$message.error(res.msg);
        }
      }).catch(e => {
        this.tdLoading = false
      })
      this.trIndex = trIndex
      this.tdIndex = tdIndex
      this.tab_index = id
    },
    handleAdd () {
      if (!this.process) {
        this.$message.error('请选择配方');
        return
      }
      if (!this.isTrainVo) {
        this.$message.error('该配方没有分配设备组');
        return
      }
      this.title = "添加"
      this.ruleFormJob = {
        autoStart: 1,
        delayTime: 0,
        seqNo: 1,
      }

      try {
        this.$refs['ruleFormJob'].resetFields();
      } catch (e) { }
      this.isShowAdd = true

    },
    async handleEdit () {
      if (!this.isTrainVo) {
        this.$message.error('该配方没有分配设备组');
        return
      }
      if (this.radioId == '') {
        this.$message.error('请选择修改的数据');
        return
      }

      let res = await formula.operationFind(this.radioId)
      this.getEquipmentList()
      // let res1 = await configure.getEquipmentList()
      if (res.code == 200) {
        this.curRow = res.data
        this.ruleFormJob = {
          jobDesc: res.data.jobDesc,
          initSchedEntId: res.data.initSchedEntId,
          seqNo: res.data.seqNo,
          nextJob: res.data.nextJob,
          firstJob: res.data.firstJob,
          finalJob: res.data.finalJob,
          fid: res.data.fid,
          equipmentId: res.data.equipmentVo ? res.data.equipmentVo.fid : "",
          autoStart: res.data.autoStart,
          delayTime: res.data.delayTime ?? 0,
        }

        const index = this.classIdList.findIndex(item => item.fid == res.data.initSchedEntId)
        if (index == -1) {
          this.classIdList.push({
            fid: res.data.initSchedEntId,
            className: res.data.equipmentClassVo ? res.data.equipmentClassVo.className : ''
          })
        }

        // if (res1.code == 200) {
        // this.equipmentList = res1.data.rows.filter(item => {
        //   item.equipmentClassVo = item.equipmentClassVo ? item.equipmentClassVo : {}
        //   let trains = new Array()
        //   trains = item.trainVos.map(x => { return x.fid })
        //   return item.equipmentClassVo.fid == this.ruleFormJob.initSchedEntId && trains.includes(this.formData.trainId)
        // })
        // this.equipmentList = res1.data.rows
        // }
        this.title = "编辑"
        this.isShowAdd = true
      } else {
        this.$message.error('数据错误');
      }
    },
    async handleDel () {
      if (this.radioId === '') {
        this.$message.error('请选择要删除的数据');
        return
      }
      let res = await formula.operationFind(this.radioId)
      let that = this
      if (res.code == 200) {
        this.$customConfirm({
          content: "请确认是否删除作业" + res.data.jobDesc,
          onok () {
            formula.operationRemove(res.data.fid).then(res1 => {
              if (res1.code == 200) {
                that.radioId = ""
                that.getDataList()
                that.itemKey = new Date().getTime()
                that.$message({ duration: 1000, type: 'success', message: '删除成功!' });
              }
            })
          }
        });
      }
    },
    handleCheck () {
      //调用接口

      addFormula.checkTbrecipe(this.recipeId).then(res => {
        if (res.code == 200) {
          this.errorList = res.data
          if (res.data.length == 0) {
            // this.isShowCheck = false
            this.$message({ duration: 1000, type: 'success', message: '配方检验成功!' })
          } else {
            this.isShowCheck = true
          }
        }
      })

    },
    handleConfirm (formName) {
      //去掉 重复添加同一设备的校验
      // let ii = this.tableData.filter(ii => ii.equipmentVo.fid == this.ruleFormJob.equipmentId)
      // if (ii.length > 0) {
      //   this.$message({ duration: 1000, type: 'warn', message: '已经添加该设备!' })
      //   return
      // }
      this.$refs[formName].validate((valid) => {
        if (valid) {
          this.ruleFormJob.recipeId = this.recipeId
          this.zyloading = true
          formula.operationAdd(this.ruleFormJob, this.title).then(res => {
            this.zyloading = false
            if (res.code == 200) {
              this.getDataList()
              this.itemKey = new Date().getTime()
              this.isShowAdd = false
              this.$refs[formName].resetFields();
            } else {
              this.$message.error(res.msg);
            }
          })
        }
      })
    },
    handleCloseJob () {
      this.isShowAdd = false
    },
    handleCloseCheck () {
      this.isShowCheck = false
    },
    handleSeqNo (index) {
      this.ruleFormJob.nextJob = this.tableData[index - 1].fid
      this.$forceUpdate()
    },
    getEquipmentClassList () {

      configure.getEqpClsByTrainId(this.formData.trainId).then(res => {
        if (res.code == 200) {
          this.classIdList = res.data
        }
      }).catch(e => {

      })

    },
    //下拉加载更多设备定义
    loadMoreItemClassFun () {
      this.pagerdev.pageNum++
      this.getEquipmentClassList()
    },
    //远程搜索设备定义
    remoteMethodItemClass (keyword) {
      this.pagerdev.keyword = keyword.trim();
      this.pagerdev.pageNum = 1
      setTimeout(() => {
        this.classIdList = []
        this.getEquipmentClassList()
      }, 200)
    },
    clearItemClass () {
      this.pagerdev.keyword = ""
      this.pagerdev.pageNum = 1
      this.classIdList = []
      this.getEquipmentClassList()
    },
    closePH (val) {
      this['isShow' + val] = false
    },
    moveUp (index, row) {
      if (this.isreadOnly) {
        return
      }
      if (index > 0) {
        if (this.isSort) {
          return
        }
        let upDate = this.tableData[index - 1];
        upDate.execSequence = index;
        this.tableData.splice(index - 1, 1);
        this.tableData[index - 1].execSequence = index - 1;
        this.tableData.splice(index, 0, upDate);
        const list = []
        this.tableData.forEach((item, index) => {
          list.push({
            fid: item.fid,
            sort: index
          })
        })
        this.isSort = true
        formula.batchModifySort(list).then(res => {
          this.isSort = false
        }).catch(e => {
          this.isSort = false
        })
        this.$forceUpdate()
      } else {
        this.$message.warning("已经是第一条，不可上移");
      }
    },
    moveDown (index, row) {
      if (this.isreadOnly) {
        return
      }
      if (this.isSort) {
        return
      }
      if (index + 1 === this.tableData.length) {
        this.$message.warning("已经是最后一条，不可下移");
      } else {
        let downDate = this.tableData[index + 1];
        downDate.execSequence = index;
        this.tableData.splice(index + 1, 1);
        this.tableData.splice(index, 0, downDate);
        this.tableData[index + 1].execSequence = index + 1;
        const list = []
        this.tableData.forEach((item, index) => {
          list.push({
            fid: item.fid,
            sort: index
          })
        })
        this.isSort = true
        formula.batchModifySort(list).then(res => {
          this.isSort = false
        }).catch(e => {
          this.isSort = false
        })
        this.$forceUpdate()
      }
    },
    queryStatus (status) {
      switch (status) {
        case 1:
          return "编辑"
        case 2:
          return this.$t('common.examine')
        case 3:
          return this.$t('common.approval')
        case 4:
          return "启用"
        case 5:
          return this.$t('common.abandoned')
        case 6:
          return "实验"
      }
    },
    table_index (index) {
      return (this.pager.pageNum - 1) * this.pager.pageSize + index
    },
    table_index1 (index) {
      return (this.formulaPage.pageNum - 1) * this.formulaPage.pageSize + index
    },
    handleDeviceType () {
      this.ruleFormJob.equipmentId = ''
      this.getEquipmentList()
    },
    getEquipmentList () {
      const param = {
        entName: this.keyEntName,
        size: 99999999
      }
      configure.getEquipmentList(param).then(res => {
        if (res.code == 200) {
          let list = res.data.rows.filter(item => {
            item.equipmentClassVo = item.equipmentClassVo ? item.equipmentClassVo : {}
            let trains = new Array()
            if (item.trainVos != null) {
              trains = item.trainVos.map(x => { return x.fid })
              return item.equipmentClassVo.fid == this.ruleFormJob.initSchedEntId && trains.includes(this.formData.trainId)
            }


            // return item.equipmentClassVo.fid == this.ruleFormJob.initSchedEntId
          })
          // list.forEach(item => {
          //     if(item.trainVos){
          //         const index = item.trainVos.findIndex(el => el.fid == this.isTrainVo)
          //         if(index > -1){
          //             item.isTrainVo = true
          //         }
          //     }
          // })
          this.equipmentList = list
          // this.equipmentList = list.filter(item => {
          //     return item.isTrainVo
          // })
        }
      })
    },
    handleFinalJob (val) {
      if (val == 1) {
        this.ruleFormJob.seqNo = ''
        this.ruleFormJob.nextJob = ''
      }
    },
    handleSelectFormula (val) {
      const item = this.formulaList.find(el => el.fid == val)
      this.ruleForm.item = item.item
      this.ruleForm.notes = item.notes
      this.ruleForm.recipeStatus = this.queryStatus(item.recipeStatus)
    },
    handleequipmentId () {
      this.$forceUpdate()
    },
    slldrag (e) {
      console.log(e)
      return
      const that = this
      slldrag(e.target).then(res => {

      })
    },
    handleAddSeq (index) {
      const that = this
      this.$customConfirm({
        content: "是否确认添加",
        onok () {
          const param = {
            operationId: that.radioId,
            seqNo: index + 1
          }
          formula.insertData(param).then(res => {
            if (res.code == 200) {
              let currRow = that.tableData.find(item => item.fid == that.radioId) //当前点击的作业
              console.log(currRow)
              const firstRow = currRow.child.find(item => item.display)
              const param = {
                isActive: 0,
                operationId: that.radioId,
                phaseCode: firstRow.title,
                phaseDesc: firstRow.text,
                seqNo: index + 1,
                serialNo: firstRow.id,
                type: firstRow.type
              }
              formula.phaseAddInfo(param).then(res => {
                that.tdLoading = false
                if (res.code == 200) {
                  that.getJobList()


                } else {
                  that.$message.error(res.msg);
                }
              }).catch(e => {
                that.tdLoading = false
              })
            } else {
              that.$message.error(res.msg);
            }
          })
        },
        oncancel () {
          let expandedRows = [1]
          that.handledetail(that.tableData[index], expandedRows)
        },
      })

    },
    handleDelSeq (index) {
      const that = this
      this.$customConfirm({
        content: "是否确认删除",
        onok () {
          const param = {
            operationId: that.radioId,
            seqNo: index
          }
          formula.removeData(param).then(res => {
            if (res.code == 200) {
              let expandedRows = [1]
              const fid = that.tableData.findIndex(item => item.fid == that.radioId)
              that.getJobList()
              // that.handledetail(that.tableData[fid], expandedRows)
            } else {
              that.$message.error(res.msg);
            }

            // that.header.splice(index, 0, index+1);
            // that.tdBody.splice(index, 0, index+1);
            // that.itemKey = new Date().getTime()
            // console.log(that.tdBody)
          })
        },
        oncancel () {
          let expandedRows = [1]
          that.handledetail(that.tableData[index], expandedRows)
        },
      })
    },
    handleClickTab (fid) {
      this.radioId = fid
      this.$nextTick(() => {
        this.colDrop()
      })
    },
    // 列表 **列拖拽
    colDrop () {
      const index = this.tableData.findIndex(item => item.fid == this.radioId)
      const wrapperTr = document.querySelector('#drag-table' + index + ' ' + '.trHeader' + index);
      const that = this
      Sortable.create(wrapperTr, {
        animation: 180,
        delay: 0,
        draggable: '.trHeaderTr',
        onEnd (evt) {
          let str = ''
          console.log(evt)

          if (evt.oldIndex > evt.newDraggableIndex) {
            str = "是否确认插入到" + (evt.newDraggableIndex) + '和' + evt.newIndex + '之间'
          } else {
            str = "是否确认插入到" + (evt.newIndex) + '和' + (evt.newIndex + 1) + '之间'
          }
          that.$customConfirm({
            content: str,
            isShowCover: false, //是否显示覆盖按钮
            onok () {
              const param = {
                operationId: that.radioId,
                seqNo: evt.oldIndex,
                newSeqNo: evt.oldIndex > evt.newDraggableIndex ? evt.newDraggableIndex : evt.newIndex,
                dragType: 1
              }
              formula.moveData(param).then((res1) => {
                if (res1.code == 200) {
                  that.getJobList()
                } else {
                  that.$message.error(res.msg);
                }
              })
            },
            oncancel () {
              let expandedRows = [1]
              that.handledetail(that.tableData[index], expandedRows)
            },
          });
        }
      });
    },
    getJobList () {
      const param = {
        page: this.pager.pageNum,
        size: this.pager.pageSize,
        recipeId: this.recipeId,
        field: this.pager.field,
        order: this.pager.order,
      }
      formula.operationList1(param).then(res => {
        if (res.code == 200) {
          let tableData = res.data.rows
          let index = tableData.findIndex(item => item.fid == this.radioId) //当前点击的作业
          if (index > -1) {
            this.tableData[index].phaseVos = tableData[index].phaseVos
          }
          let expandedRows = [1]
          this.handledetail(this.tableData[index], expandedRows)
        }
      }).catch(e => {
        this.$message.error('服务器繁忙,请稍后再试');
      })

    }
  }
}
</script>

<style scoped>
.btngroup {
  float: right;
  margin-right: 20px;
}
.selectItem >>> .el-select {
  width: 100%;
}
.process {
  font-size: 14px;
  color: #666;
}
.table_form {
  width: 100%;
  border-top: 1px solid #dedfe3;
  border-left: 1px solid #dedfe3;
}
thead {
  background: #f9f9f9;
}
thead td {
  font-weight: bold;
}
.table_form td,
.table_form th {
  border-right: 1px solid #dedfe3;
  border-bottom: 1px solid #dedfe3;
  text-align: center;
  min-width: 30px;
  padding: 6px 5px;
  white-space: nowrap; /* 禁止超出自动换行 */
}
.tableAuto >>> .el-table__expanded-cell {
  padding: 0px 0;
}
.tableAuto >>> .el-table__body-wrapper {
  overflow: auto;
}
.XYaxis {
  background: #bcb3d8 !important;
  color: #fff !important;
}
.currTd {
  background: #8080ff !important;
}
.selectClass >>> .el-select {
  width: 100%;
}
.theads th {
  background: rgb(234, 235, 236);
}
.allowed {
  cursor: not-allowed !important;
  opacity: 0.6;
}
.addDel {
  cursor: pointer;
}
.tableAuto1 >>> .el-table__row td {
  padding: 5px 0;
}
</style>
